const HtmlWebPackPlugin = require("html-webpack-plugin");
const webpack = require('webpack');


module.exports = {
    entry: './src/index.js',
    devtool: 'source-map',
    module: {
        rules: [{
            test: /\.js$/,
            exclude: /node_modules/,
            use: [
                "babel-loader",
                "eslint-loader"
            ]
        }, {
            test: /\.html$/,
            use: [{
                loader: "html-loader",
                options: { minimize: true }
            }]
        },/* {
            test: /\.css$/,
            use: ["style-loader", "css-loader"]
        }, */{
            test: /\.scss$/,
            // use: extractSass.extract({
            //     use: [{
            //         loader: "css-loader"
            //     }, {
            //         loader: "sass-loader"
            //     }],
            //     // use style-loader in development
            //     fallback: "style-loader"
            // })
            use: ["style-loader", "css-loader", "sass-loader"]
        }]
    },
    plugins: [
        new HtmlWebPackPlugin({
            template: "./src/index.html",
            filename: "index.html"
        }),
        // new MiniCssExtractPlugin({
        //     filename: "[name].css",
        //     chunkFilename: "[id].css"
        // }),
        // extractSass,
        new webpack.HotModuleReplacementPlugin()
    ],
    devServer: {
        // host: '192.168.1.110',
        contentBase: 'public',
        port: 8090,
        compress: true,
        hot: true
    }
};
